<script setup>
import { introApi } from "@/services/index";
import { onLoad, onShow, onHide, onReachBottom } from "@dcloudio/uni-app";
import { nextTick, ref, watch, onMounted, onUnmounted } from "vue";

import { stockLog } from "@/services/transfer";
// const id = ref("");
const item = ref({});

onLoad((e) => {
  item.value = e.item ? JSON.parse(decodeURIComponent(e.item)) : {};

  form.value.productId = item.value.id;
  form.value.scId = item.value.scId;
  getAppProductQuery();
});

onShow(() => {
  // TimeIndex.value = 5;
  // getPayResult();
});
onUnmounted(() => {});
onHide(() => {});

//获取商品
const form = ref({
  productId: "",
  scId: "",
  pageIndex: 1,
  pageSize: 20,
  changeType: "",
});

const productData = ref([]);

const loading = ref("");
const getAppProductQuery = async (index) => {
  if (index == 1) {
    productData.value = [];
    loading.value = "";
  }
  if (index) {
    form.value.pageIndex = index;
  }
  if (loading.value == "noMore") {
    return;
  }
  loading.value = "Loading";
  try {
    let res = await stockLog(form.value);
    if (res.code == 200) {
      productData.value = productData.value.concat(res.data.datas);

      form.value.pageIndex = form.value.pageIndex + 1;

      if (res.data.datas.length < form.value.pageSize) {
        loading.value = "noMore";
      } else {
        loading.value = "More";
      }
    } else {
    }

    console.log(res);
  } catch (e) {}
};

const selectChange = (index) => {
  form.value.changeType = index;
  getAppProductQuery(1);
};
onReachBottom(() => {
  console.log("触底了");
  getAppProductQuery();
});

const goRb = (type, id) => {
  console.log(type, id);
  // 盘点入库
  if (type == 7) {
    uni.navigateTo({
      url: "/pages/stocktaking/record_det/index?id=" + id,
    });
  }
};
</script>

<template>
  <view class="bg">
    <up-navbar
      bgColor="#ffffff"
      @rightClick="rightClick"
      :autoBack="true"
      :safeAreaInsetTop="true"
      :fixed="true"
      :placeholder="true"
      :leftText="'返回'"
    >
      <template #right> </template>
      <template #center>
        <text
          class="text-white"
          style="
            font-weight: 500;
            font-size: 34rpx;
            color: #000000;
            line-height: 48rpx;
            text-align: center;
          "
          >库存变动明细</text
        ></template
      >
    </up-navbar>

    <view class="top">
      <view class="left">
        <view class="image">
          <image :src="item.image" mode="scaleToFill" />
        </view>
        <view class="info">
          <view class="name">
            <text>{{ item.name }}</text></view
          >
          <view class="unit">单位: {{ item.unit }} </view>
          <view class="code">条码:{{ item.code }}</view>
        </view>
      </view>
      <view class="right"> 库存: {{ item.stockNum }} </view>
    </view>

    <view class="list">
      <view class="list-select">
        <text>库存变动记录</text>
        <view class="select">
          <view
            class="select-item"
            :class="form.changeType == '' ? 'on' : ''"
            @click="selectChange('')"
          >
            全部
          </view>
          <view
            class="select-item"
            :class="form.changeType == 1 ? 'on' : ''"
            @click="selectChange(1)"
          >
            增加
          </view>
          <view
            class="select-item"
            :class="form.changeType == 2 ? 'on' : ''"
            @click="selectChange(2)"
          >
            减少
          </view>
        </view>
      </view>
      <view class="hx"></view>
      <view class="list-item" v-for="(item, index) in productData" :key="index">
        <view class="time"> {{ item.createTime }}</view>
        <view class="info">
          <view class="title">
            <text>{{ item.bizCode }}</text>
            <!--  @click="goRb(item.bizType, item.bizId)" 查看数据单号 -->
            <text></text>
          </view>
        </view>
        <view class="num">
          <view class="num-2">
            <view class="num-item">
              <text>类型</text>
              <text>{{ item.bizTypeName }}</text>
            </view>
            <view class="num-item">
              <text>操作人</text>
              <text>{{ item.createBy }}</text>
            </view>
          </view>
        </view>
        <view class="up">
          <!-- <text class="left">变动数据</text> -->
          <text class="up-num"
            ><text class="bt_list"
              >变动前<text class="blue">{{ item.oriStockNum }}</text></text
            >
            <text class="bt_list">
              变动数量<text class="blue">{{ item.stockNum }}</text></text
            >
            <text class="bt_list"
              >变动后<text class="blue">{{ item.curStockNum }}</text></text
            >
          </text>
        </view>
      </view>
    </view>
    <view class="noData" v-if="productData.length <= 0 && loading == 'noMore'">
      <view class="noData-img">
        <image src="@/static/nodate/datas.png" mode="scaleToFill" />
        <view>暂无记录 </view>
      </view>
    </view>

    <view
      class="loading-form"
      v-if="
        loading && productData.length > 0 && productData.length >= form.pageSize
      "
      ><van-loading size="24rpx" v-if="loading == 'Loading'"
        ><text class="loading-text">加载中...</text>
      </van-loading>
      <text class="loading-text" v-if="loading == 'More'">加载更多</text>
      <text class="loading-text" v-if="loading == 'noMore'">~没有数据了~</text>
    </view>
  </view>
</template>

<style lang="scss" scoped>
@import "index.scss";
</style>
